<!-- 添加宿舍楼提示框 -->
<template>
  <el-dialog
    v-model="props.isPrompt"
    title="添加宿舍楼确认单"
    width="500"
    @close="close"
  >
    <div class="main">
      <p>
        <span class="tilte">宿舍楼名称</span><span>:</span
        ><span>{{ AddDormitoryData.dormitoryName }}</span>
      </p>
      <p>
        <span class="tilte">楼层数</span><span>:</span
        ><span>{{ AddDormitoryData.floorNum }}</span>
      </p>
      <p>
        <span class="tilte">每层房间数</span><span>:</span
        ><span>{{ AddDormitoryData.roomNum }}</span>
      </p>
      <p>
        <span class="tilte">几人间</span><span>:</span
        ><span>{{ AddDormitoryData.peopleNum }}</span>
      </p>
      <p>
        <span class="tilte">价格</span><span>:</span
        ><span>{{ AddDormitoryData.price }}元</span>
      </p>
      <p class="promptText" v-if="!AddDormitoryData.isExist">
        注:没有查询到{{
          AddDormitoryData.peopleNum
        }}人间的宿舍费,请输入宿舍费,本次输入的宿舍费将保存下来以便下次使用
      </p>
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="submit" type="primary">提交</el-button>
        <el-button type="danger" @click="close"> 关闭 </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import { addDormitory } from "@/api/dormitoryInfo.js";
import { useUserStore } from "@/store/useUserStore.js";
const { getUserInfo } = useUserStore();
const props = defineProps({
  isPrompt: {
    type: Boolean,
    default: false,
  },
  AddDormitoryData: {
    type: Object,
    requierd: true,
  },
});
const emit = defineEmits(["closePrompt"]);
// 提交
const submit = async () => {
  const { data } = await addDormitory({
    dormitoryName: props.AddDormitoryData.dormitoryName,
    floorNum: props.AddDormitoryData.floorNum,
    roomNum: props.AddDormitoryData.roomNum,
    fewPeople: props.AddDormitoryData.peopleNum,
    RoomRateId: props.AddDormitoryData.id,
    price: props.AddDormitoryData.price,
    isExits: props.AddDormitoryData.isExist,
  });
  if (data) {
    ElMessage({
      message: "创建成功",
      type: "success",
    });
    await getUserInfo();
  }
  emit("submitPrompt", false);
};
// 关闭
const close = () => {
  emit("closePrompt", false);
};
</script>

<style lang="less" scoped>
@import "@/styles/var.less";
p {
  margin: 5px 0;
  font-size: 1em;
  color: @second;
}
span {
  margin: 0 2px;
}
.tilte {
  width: 70px;
  text-align-last: justify;
  display: inline-block;
}
.promptText {
  font-size: 0.9em;
  color: @danger;
}
</style>